<template>
  <div style="display: flex;">
    <div>
      <Select v-model="month" style="width:120px" placeholder="选择月" @on-change="changeMonth">
        <Option v-for="(item,index) in monthList" :value="item" :key="item">{{ item }}</Option>
      </Select>
    </div>
    <div style="margin-left: 10px;margin-right: 10px;">-</div>
    <div>
      <Select v-model="day" style="width:120px" placeholder="选择日" @on-change="changeDay">
        <Option v-for="(item,index) in dayList" :value="item" :key="item">{{ item }}</Option>
      </Select>
    </div>
  </div>
</template>
<script>
  export default {
    props: ['isEditDate'],
    data() {
      return {
        monthList: [],
        dayList: [],
        month: "",
        day: "",
      }
    },
    watch: {
      isEditDate: {
        handler(value) {
          if (value !== "") {
            let arr = value.split('-')
            this.month = arr[0]
            this.changeMonth()
            this.day = arr[1]
          } else {
            this.month = ""
            this.day = ""
          }
        },
        deep: true,
        immediate: true,
      }
    },
    methods: {
      changeDay() {
        let date = this.month + "-" + this.day
        this.$emit('changeDate', date)
      },
      changeMonth() {
        if (this.month !== '02') {
          let arr = []
          for (let i = 1; i <= 31; i++) {
            let month = String(i)
            if (String(i).length === 1) {
              month = '0' + String(i)
            }
            arr.push(month)
          }
          this.dayList = arr
        } else {
          let arr = []
          for (let i = 1; i <= 28; i++) {
            let month = String(i)
            if (String(i).length === 1) {
              month = '0' + String(i)
            }
            arr.push(month)
          }
          this.dayList = arr
        }
      },
      reset() {
        this.month = "",
          this.day = ""
      }
    },
    created() {
      let arr = []
      for (let i = 1; i <= 12; i++) {
        let month = String(i)
        if (String(i).length === 1) {
          month = '0' + String(i)
        }
        arr.push(month)
      }
      this.monthList = arr
    },
  }
</script>
<style lang="less" scoped>

</style>